<template>
	<view class="body">
		<view class="headers">
			<u-search @clickIcon="searchs" @search="searchs" placeholder="科室/医生名称" v-model="keyword" :showAction="false"
				placeholder-color="width">
			</u-search>
			<u-popup v-model="showcode" mode="center">
				<view class="code">
					<!-- <canvas  style="width: 400rpx;height: 400rpx;" canvas-id="couponQrcode"></canvas> -->
					<uv-qrcode ref="qrcode" size="400rpx" :value="user.IDCard"></uv-qrcode>
					<!-- <canvas id="qrcode" canvas-id="qrcode" style="width: 200px;height: 200px;"></canvas> -->
					<view class="codetetx">
						<span>姓名：{{user.Name}}</span>
						<span>身份证：{{user.IDCard}}</span>
					</view>
				</view>
			</u-popup>
			<view class="existjiuzhenka" v-if="exist==true">
				<view class="existleft">
					<view class="elone">
						<view><span>{{hideInsurantName(user.Name)}}&emsp;</span></view>
						<view class="mr"><span>默认</span></view>
						<!-- <view class="qh" @click="addjzk"><span>切换</span></view> -->
					</view>
					<span>{{hideInsurantName(user.IDCard)}}</span>
					<span>{{hideInsurantName(user.Mobile)}}</span>
				</view>
				<view class="existright" @click="canvas">
					<view class="qrcode">
						<u-image width="150rpx" height="150rpx" src="/static/icon/ewm.png"></u-image>
						<span class="sm">扫码就医</span>
					</view>
				</view>
				<view class="existcont">
					<view>
						<view style="width: 30px;float: left; "><u-icon name="/static/icon/yuan.png" size="22"></u-icon>
						</view><span style="float: left;">默认就诊人</span>
					</view>
					<view class="">
						<span class="Unbinding" @click="redirectToBindCard()">切换</span>
						<span class="Unbinding" @click="getmoren">解绑</span>
					</view>

				</view>
			</view>
			<view class="jiuzhenka" v-else @click="redirectToBindCard()">
				<view class="headera">
					<!-- <view style="width:13%;float: left;"><u-icon size="80" name="/static/logo.png"></u-icon></view> -->
					<view style="color: white;float: left;">医院预约系统</view>
				</view>
				<view class="textlist">
					<span style="font-size: 20px;font-weight: 600;">就诊卡</span>
					<span style="font-size: 14px;">Medical Card</span>
					<view class="textcolor"
						style="background-color: white;margin-top: 10px;width: 100%;text-align: center;font-size: 30rpx;font-weight: bold;">
						<span>初次使用请先添加就诊人</span>
					</view>
				</view>
			</view>
			<view class="cont">
				<view class="contlist" @click="Department" :style="{'width':type==2?'100%':''}">
					<view class="contleft">
						<u-icon name="/static/icon/yyghc.png" size="100"></u-icon>
					</view>
					<view class="contright">
						<span class="conta" v-if="type!=2">预约挂号</span>
						<span class="conta" v-if="type==2">预约体检</span>
						<span class="contb">选功能&emsp;快速预约</span>
					</view>
				</view>
				<view class="contlist" @click="Mknowledge" v-if="type!=2" >
					<view class="contleft">
						<u-icon name="/static/icon/jkzxc.png" size="100"></u-icon>
					</view>
					<view class="contright" >
						<span class="conta">报告查询</span>
						<span class="contb">手机查看&emsp;早知道</span>
					</view>
				</view>
			</view>

		</view>

		<view class="jgc"></view>
		<view class="row" v-show="type!=2">
			<view class="title">
				<span>门诊服务</span>
			</view>
			<u-grid :border="false" col="4">
				<u-grid-item v-for="(mzlistItem,mzlistIndex) in mzlist" :key="mzlistIndex"
					@click="mzlistclick(mzlistIndex)">
					<view style="">
						<u-icon :name="mzlistItem.name" :size="80"></u-icon>
					</view>
					<view class="">
						<text class="grid-text">{{mzlistItem.title}}</text>
					</view>
				</u-grid-item>
			</u-grid>
		</view>
		<view class="jgc"></view>
		<view class="row" v-show="type!=1">
			<view class="title">
				<span>体检服务</span>
			</view>
			<u-grid :border="false" col="4">
				<u-grid-item v-for="(tjlistItem,tjlistIndex) in tjlist" :key="tjlistIndex"
					@click="tjlistclick(tjlistIndex)">
					<view style="">
						<u-icon :name="tjlistItem.name" :size="80"></u-icon>
					</view>
					<view class="">
						<text class="grid-text">{{tjlistItem.title}}</text>
					</view>
				</u-grid-item>
			</u-grid>
		</view>
		<view class="jgc"></view>
		<view class="row"   v-if="type!=2">
			<view class="title">
				<span>住院功能</span>
			</view>
			<u-grid :border="false" col="4">
				<u-grid-item v-for="(zylistItem,zylistIndex) in zylist" :key="zylistIndex"
					@click="zylistclick(zylistIndex)">
					<view style="">
						<u-icon :name="zylistItem.name" :size="80"></u-icon>
					</view>
					<view class="">
						<text class="grid-text">{{zylistItem.title}}</text>
					</view>
				</u-grid-item>
			</u-grid>
			<!-- <u-toast ref="uToast" /> -->
		</view>
		<view class="jgc"></view>
		<view class="row">
			<view class="title">
				<span>院内服务</span>
			</view>
			<u-grid :border="false" col="4">
				<u-grid-item v-for="(ynlistItem,ynlistIndex) in ynlist" :key="ynlistIndex" @click="click(ynlistIndex)">
					<view class="yuanneifuwu" v-if="ynlistItem.id==1">
						<a href="https://mp.weixin.qq.com/insurance/card/creditjump?cityid=999999&from=Tc-gMaC7Jm7z5At2u3HmkA.%3D#wechat_redirect"
							class="but">
							<view class="yuanneifuwu">
								<view style="">
									<u-icon :name="ynlistItem.name" :size="80"></u-icon>
								</view>
								<view class="">
									<text class="grid-text">{{ynlistItem.title}}</text>
								</view>
							</view>
						</a>
					</view>
					<view class="yuanneifuwu" v-else-if="ynlistItem.id==19">
						<a href="weixin://dl/business/?appid=wx1e641c1dee73aa3f&path=pages/index/index&query=&env_version=release"
							class="but">
							<view class="yuanneifuwu">
								<view style="">
									<u-icon :name="ynlistItem.name" :size="80"></u-icon>
								</view>
								<view class="">
									<text class="grid-text">{{ynlistItem.title}}</text>
								</view>
							</view>
						</a>
					</view>
					<view class="yuanneifuwu" v-else>
						<view style="">
							<u-icon :name="ynlistItem.name" :size="80"></u-icon>
						</view>
						<view class="">
							<text class="grid-text">{{ynlistItem.title}}</text>
						</view>
					</view>

				</u-grid-item>
			</u-grid>
			<!-- <u-toast ref="uToast" /> -->

		</view>
		<view class="">
			<!-- <view class="copyright">
				<view class="fleft"><u-icon size="50" name="/static/logocolor.png"></u-icon></view>
				<view class="fleft">珠山区妇幼保健计划生育服务中心</view>
			</view>
			<view class="copyright">
				<view class="fleft"><span style="font-size:30rpx;">&emsp;©.</span></view>
				<view class="fleft">徐州市通用科技</view>
			</view> -->
		</view>
		<view class="dixia">

		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapGetters
	} from 'vuex'
	import UQRCode from 'uqrcodejs';

	export default {
		data() {
			return {
				type:"",
				healthCode: '',
				showcode: false,
				healthid: '',
				user: {
					Mobile: '暂无',
					IDCard: '暂无',
					Name: '暂无'
				},
				couponQrcode: '123465798',
				exist: false,
				addimg: '/static/tjjzk.png',
				keyword: '',
				src: '/static/gg.png',
				zylist: [{
						id: '1',
						token: 'ss',
						path: '/pages/zhuyaun/charge/charge',
						name: '/static/icon/rqdc.png',
						title: '费用清单'
					},
					{
						id: '2',
						token: 'ss',
						path: '/pages/tool/jynotice/rysc',
						name: '/static/icon/xuzc.png',
						title: '入院手册'
					},

				],
				mzlist: [{
						id: '1',
						token: 'ss',
						path: '/pages/block/Visit/Visit',
						name: '/static/icon/jzrglc.png',
						title: '就诊人管理'
					},
					{
						id: '0',
						token: 'ss',
						path: '/pages/register/Scheduling/record/record',
						name: '/static/icon/ghjlc.png',
						title: '预约记录'
					},
					{
						id: '0',
						token: 'ss',
						path: '/pages/zhuyaun/charge/chargemz',
						name: '/static/icon/cfmxc.png',
						title: '处方明细'
					},
					{
						id: '4',
						token: 'ss',
						path: '/pages/tool/jynotice/jynotice',
						name: '/static/icon/jyxzc.png',
						title: '就医须知'
					},
				],


				tjlist: [{
						id: '0',
						token: 'ss',
						path: '/pages/MedicalExamination/MedicalExamination',
						name: '/static/icon/tjrgl.png',
						title: '体检人管理'
					},
					{
						id: '0',
						token: 'ss',
						path: '/pages/MedicalExamination/ChaXun/ChaXun',
						name: '/static/icon/cktjbg.png',
						title: '查看体检报告'
					},
					{
						id: '0',
						token: 'ss',
						path: '/pages/MedicalExamination/Record/Record',
						name: '/static/icon/ckyy.png',
						title: '查看预约'
					},
					// {
					// 	id: '0',
					// 	token: 'ss',
					// 	path: '/pages/zhuyaun/charge/chargemz',
					// 	name: '/static/icon/cfmx.png',
					// 	title: '处方明细'
					// },


				],


				ynlist: [
					// {
					// 	id: '1',
					// 	token: 'ss',
					// 	// path: '/pages/zhuyaun/ybpz/ybpz',
					// 	path: '',
					// 	name: '/static/icon/ybpz.png',
					// 	title: '医保凭证'
					// },


					// {
					// 	id: '9',
					// 	token: 'ss',
					// 	path: '/pages/tool/jynotice/zxzx',
					// 	name: '/static/icon/zxzxc.png',
					// 	title: '在线咨询'
					// },
					// {
					// 	id: '7',
					// 	token: 'ss',
					// 	path: '/pages/My/fapiao/fapiaoyj',
					// 	name: '/static/icon/fpsq.png',
					// 	title: '票据邮寄'
					// },
					// {
					// 	id: '19',
					// 	token: 'ss',
					// 	path: '',
					// 	name: '/static/icon/ms.png',
					// 	title: '复兴餐厅'
					// },
					{
						id: '6',
						token: 'ss',
						path: '/pages/zhuyaun/ksjs/ksjs',
						name: '/static/icon/ksjs3c.png',
						title: '科室介绍'
					},
					{
						id: '8',
						token: 'ss',
						path: '/pages/doctor/doctor',
						name: '/static/icon/doctorc.png',
						title: '医生介绍'
					},
					// {
					// 	id: '3',
					// 	token: 'ss',
					// 	path: '/pages/zhuyaun/myddc/myddc',
					// 	name: '/static/icon/myddcc.png',
					// 	title: '满意度调查'
					// },

					// {
					// 	id: '3',
					// 	token: 'ss',
					// 	path: '/pages/MedicalExamination/Health/Health',
					// 	name: '/static/icon/myddcc.png',
					// 	title: '查看体检报告'
					// },
					{
						id: '111',
						token: 'ss',
						path: '/pages/menzhenmanyidu/myddc',
						name: '/static/icon/gzc.png',
						title: '门诊满意度'
					},

				]

			}
		},
		computed: {
			...mapState(['token'], ['userInfo']),
			...mapGetters(['hasLogin', 'getUserInfo']),
		},
		 
		
		onLoad() {
			this.type = window.location.href.split("=")[1].split("#")[0]
		},
		
		onShow() {
			
			if (this.hasLogin) {
				//this.$store.dispatch('getUserInfo');
				
				console.log(this.type)
				this.mrjzr()
				

			} else {
				// this.exist = false
				// return
				this.toWx()

			}
		},



		methods: {
			mrjzr() {
				this.$request("patient", "defaultInfo").then(res => {

					if (res.code == 1) {
						if (res.data) {
							this.user = res.data
							this.exist = true
							console.log(this.user)
						} else {
							this.exist = false
						}

					} else {
						this.exist = false

						console.log("暂无就诊人")

					}
				})
			},
			toWx() {
				return
				let code = ''
				uni.showLoading({
					title: '登录中',
					mask: true
				});
				//console.log('登录！')
				// 在需要实现微信公众号登录的地方调用 uni.login() 方法
				//console.log("local")
				// 判断是否是微信内置浏览器
				const isWechat = () => {
					let ua = window.navigator.userAgent.toLowerCase();
					return ua.match(/MicroMessenger/i) == 'micromessenger';
				}
				if (isWechat) {
					// 授权回调
					//var appid = 'wxa10d8cbc31fcd0e3';
					//fuxing
					var appid = 'wx9fb65fd5835725db';
					//竹山妇幼
					// var appid = 'wx2623dffafa67fadf';
					//获取路径（要在微信内置浏览器打开，或者是用你部署环境的链接打开）
					let local = window.location.href.split("#")[0];
					//console.log("local", local)
					//拼接在微信时打开的url
					let url = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=" + appid + "&redirect_uri=" +
						encodeURIComponent(local) + "&response_type=code&scope=snsapi_userinfo&state=1#wechat_redirect";
					// 从url中截取code
					code = this.GetParam(window.location.href.split("#")[0], "code");
					// console.log("code", code)
					if (!code) {
						window.location.href = url;
					} else {
						this.$request("auth", "wxlogin", {
							Code: code
						}).then(res => {
							console.log(res)
							uni.hideLoading();
							if (res.code == 1) {
								uni.showToast({
									title: '登陆成功',
									icon: 'none',
									duration: 2000
								});
								this.$store.commit('setToken', {
									token: res.data.AccessToken,
									mark: res.data.LoginMark,
									expire: res.data.Expires
								});
								this.mrjzr()
							} else {
								uni.showToast({
									title: res.msg,
									icon: 'none',
									duration: 2000
								});
							}
							// this.$dialog.msg('登录成功', 500).then(function() {
						})
						// // 处理截取到的code
						// code = this.GetParam(window.location.href, "code");
						// var openid = localStorage.getItem('openid')
					}
				} else {
					console.log('请在微信客户端打开')
				}
			},
			GetParam(url, code) {
				url = url + "";
				let regstr = "/(\\?|\\&)" + code + "=([^\\&]+)/";
				let reg = eval(regstr);
				//eval可以将 regstr字符串转换为 正则表达式
				let result = url.match(reg);
				if (result && result[2]) {
					return result[2];
				}
			},
			Mknowledge() {
				// let Code = this.$store.state.wledge.Mknowledge
				uni.navigateTo({
					url: '/pages/zhuyaun/newbgcx/newbgcx',
					fail(error) {
						console.log(error)
					}
				})
			},
			Department() {
				uni.navigateTo({
					// url: `/pages/newregister/selectDepartment/selectDepartment`,
					url: `/pages/index/fenkai`,
					
					fail(error) {
						console.log(error)
					}
				})
				// uni.navigateTo({
				// 	url: `/pages/register/selectDepartment/selectDepartment`,
				// 	fail(error) {
				// 		console.log(error)
				// 	}
				// })
			},
			addVisit() {
				uni.navigateTo({
					url: `/pages/block/addVisit/addVisit`,
					fail(error) {
						console.log(error)
					}
				})
			},
			closeOnClickOverlays() {
				this.showcode = false
			},
			clicks() {
				this.showcode = true
			},
			canvas() {
				this.couponQrCode()
			},
			open() {
				// console.log('open');
			},
			close() {
				this.showcode = false
				// console.log('close');
			},
			couponQrCode() {

				console.log("UQRCode", UQRCode)

				// 获取uQRCode实例
				var qr = new UQRCode();
				// 设置二维码内容
				qr.data = "123456";
				// 设置二维码大小，必须与canvas设置的宽高一致
				qr.size = 200;
				// 调用制作二维码方法
				qr.make();
				// 获取canvas上下文
				var canvasContext = uni.createCanvasContext('qrcode', this); // 如果是组件，this必须传入
				// 设置uQRCode实例的canvas上下文
				qr.canvasContext = canvasContext;
				// 调用绘制方法将二维码图案绘制到canvas上
				qr.drawCanvas();

				this.showcode = true
			},
			bindmarkertap() {
				// 打开的点击事件，传经纬度和地点名
				console.log('走的这里', '中国矿业大学南湖校区');
				wx.openLocation({
					latitude: 34.28568, // 纬度
					longitude: 117.25661, // 经度
					name: '徐州仁慈手外伤专科医院', // 地址名称
					address: '徐州仁慈手外伤专科医院', // 详细地址
					success: function(r) {
						console.log(r)
					},
					fail: function(res) {
						console.log('拉起失败啦', res)
					}
				})
			},
			getmoren() {
				let pat

				pat = this.user.PatientId

				this.$request('patient', 'delete', {
					PatientId: pat
				}).then(res => {

					if (res.code == 1) {
						window.location.reload()
						uni.hideLoading();

						uni.switchTab({
							url: `/pages/index/index`,
						})
					} else {
						uni.hideLoading();
						uni.showToast({
							title: "解绑失败",
							icon: 'none',
							duration: 2000
						});
					}
				})








			},
			// shanchu() {

			// 		uni.showLoading({
			// 			title: '提交中'
			// 		})
			// 		this.$request('patient', 'submit', {
			// 			Name: "宋家兴",
			// 			Sex: "男",
			// 			IDCard: "320323199912012239",
			// 			Mobile: "19529347002"
			// 		}).then(res => {

			// 			if (res.code == 1) {
			// 				let doctorinfor = false
			// 				uni.hideLoading();
			// 				window.location.reload ()
			// 			} else {
			// 				uni.hideLoading();
			// 				uni.showToast({
			// 					title: res.msg,
			// 					icon: 'none',
			// 					duration: 2000
			// 				});
			// 			}
			// 		})


			// 	},
			addjzk() {
				//console.log(this.token)
				let timeId = false
				uni.navigateTo({
					url: `/pages/block/Visit/Visit?doctorinfor=${timeId}`,
					fail(error) {
						console.log(error)
					}
				})
			},
			zylistclick(index) {
				// console.log(index)
				let path = this.zylist[index].path
				if (path != false) {
					// console.log("132")
					uni.navigateTo({
						url: path,
						fail(error) {
							console.log(error)
						}
					})
				} else {
					uni.showToast({
						title: '此模块正在开发',
						icon: 'none',
						duration: 2000
					});
				}
			},
			mzlistclick(index) {
				if (index == 0) {
					this.redirectToBindCard()
					return
				}



				console.log(index)
				let path = this.mzlist[index].path
				if (path != false) {
					uni.navigateTo({
						url: path,
						fail(error) {
							console.log(error)
						}
					})
				} else {
					uni.showToast({
						title: '此模块正在开发',
						icon: 'none',
						duration: 2000
					});
				}
			},
tjlistclick(index) {

				// if (index == 0) {
				// 	this.redirectToBindCard()
				// 	return
				// }



				console.log(index)
				let path = this.tjlist[index].path
				if (path != false) {
					uni.navigateTo({
						url: path,
						fail(error) {
							console.log(error)
						}
					})
				} else {
					uni.showToast({
						title: '此模块正在开发',
						icon: 'none',
						duration: 2000
					});
				}
			},

			click(index) {


				console.log(index)
				if(index==2)
				{
					
				window.location.href = 'https://f.wps.cn/g/bJYpUdyA/';
				return 
				}
				console.log(11111111111111111111)
				let path = this.ynlist[index].path

				if (path != false) {
					uni.navigateTo({
						url: path,
						fail(error) {
							console.log(error)
						}
					})
				} else {
					uni.showToast({
						title: '请稍后',
						icon: "loading",
						duration: 2000,
					});
				}

			},
			searchs() {
				let keywords = this.keyword
				uni.navigateTo({
					url: `/pages/doctor/doctor?keyword=${keywords}`,
					fail(error) {
						console.log(error)
					}
				})
			},
			hideInsurantName(val) {
				if (!val || val === '') return ''
				let name = ''
				if (val.length === 2) {
					name = val.substring(0, 1) + '*' // 截取name 字符串截取第一个字符，
				} else if (val.length === 3) {
					name = val.substring(0, 1) + '*' + val.substring(2, 3) // 截取第一个和第三个字符
				} else if (val.length === 4) {
					name = val.substring(0, 2) + '*' + '*' // 4个字隐藏后面两个
				} else if (val.length > 4 && val.length < 11) {
					name = val.substring(0, 1) // 5个字只显示第一个字
					for (let i = 0; i < val.length - 1; i++) {
						name = name + '*'
					}
				} else if (val.length == 18) {
					name = val.substring(0, 6) + '********' + val.substring(14, 18) // 身份证

				} else if (val.length == 11) {
					name = val.substring(0, 3) + '****' + val.substring(7, 11) // 身份证

				}
				return name
			},

			redirectToBindCard() {
				const hospitalId = '40119';
				const redirectUri = 'http://xncdwx.xztongyong.cn/h5/#/pages/MedicalExamination/Healthcard/Healthcard';
				const bindCardUrl = this.constructBindCardUrl(hospitalId, redirectUri);
				window.location.href = bindCardUrl;
			},

			constructBindCardUrl(hospitalId, redirectUri) {
				const baseUrl = "https://h5-health.tengmed.com/h5/tencent/open/card/regist";
				const encodedRedirectUri = encodeURIComponent(redirectUri);
				let bindCardUrl = `${baseUrl}?hospitalId=${hospitalId}&redirect_uri=${encodedRedirectUri}`;
				return bindCardUrl;
			},


		}
	}
</script>

<style>
	@import './index.css';
</style>
<style lang="scss">
	a {
		text-decoration: none;
	}

	.grid-text {
		font-size: 14px;
		color: #909399;
		padding: 10rpx 0 20rpx 0rpx;
		/* #ifndef APP-PLUS */
		box-sizing: border-box;
		/* #endif */
	}
</style>